td{padding:0 !important}
textarea {
    resize: none;
}
html,body{height:100%;}
ul,li{padding:0;margin:0;list-style:none}
.content{width:100%;height:100%;}
.message-mobile{width:100%;height:100%;overflow:hidden;display:none}

.tip{
    display:block;
    background:#f00;
    border-radius:50%;
    width:8px;
    height:8px;
    top:0px;
    right:0px;
    position:absolute;
}
table{
    height:calc(100% - 80px)
}
.fl{
    float:left
}
.fr{
    float:right
}
.users-box {width:100%}
.users-box,.tabs{width:100%;}
.first-tr td h4{
    margin: 0;
    padding-left: 80px;
    font-size: 16px;
}
.first-tr td{
    border: none !important;
    vertical-align: inherit !important;
}
.first-tr{
    height: 70px;
}

.message-box{height:calc(100% - 200px);position:relative;background:#f1f1f1}
.message-mobile-back{position:absolute;right:15px;top:15px;cursor:pointer;z-index:2}

.message-box .avatar{
    height:50px;
    background:#f8f8f8;
}
.message-box .avatar .avatar-user .delete{
    margin-left:15px;
    cursor:pointer
}
.message-box .message{
    background:#f1f1f1;
    height:calc(100% - 50px) !important;
    overflow-y:auto;
    min-height: 53vh;
    padding-top: 20px;
}
.message-titles a{
    text-decoration: none;
    color: #556fb5;
    margin-right: 18px;
}
.message-input{
    height:200px;
}
.alert-danger{
    background-color: transparent !important;
}
.message-titles{
    height:20px;
    line-height:20px;
    border-top:1px #dbdbdb solid;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: solid 1px #f2f2f2;
    padding: 20px 0;
    padding-left: 20px;
}
.message-txtarea{
    height:180px;
    overflow:hidden;
    width:100%;
}
.message-txtarea-input{
    height:110px;
    line-height:21px;
    font-size:12px;
    padding:10px;
    overflow-y:auto;
    width:100%;
    border:0;
    background-color: rgba(246, 246, 246, 0.37);
}
.message-txtarea-btn{
    height:24px;
    overflow:hidden;
    padding-left:10px;
    padding-right:10px;
    margin-top:6px;
}
.message-txtarea-btn a{
    width: 65px;
}
.public-message{
    width:calc(100% - 150px);
    line-height:24px;
    padding:0 10px;
    overflow:hidden;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    position:relative;
    height:24px;
}
.public-message span{
    display:inline-block;
    position:absolute;
    left:0;
    top:0;
    z-index:99
}

.users {
    height:calc(100vh - 238px);
    overflow-y:scroll;
}
.users li,.users-list li{
    width:100%;
    overflow:hidden;
    border-bottom:1px #dbdbdb dotted;
    position:relative;
    cursor:pointer;
    display: flex;
    align-items: center;
    padding: 5px 15px;
}
.users li img,.users-list li img{
    float:left;
    width:30px;
    height:30px;
    border-radius:30px
}
.users li .infos{
    float:left;
    width:calc(100% - 80px);
    height:60px;
    margin-left:5px;
    margin-right:5px;
    overflow: hidden;

}
.users li .time{
    width:40px;
    height:40px;
    float:right;
	font-size:11px;
    color:#999
}
.users li h4,.users li .text,.users-list li h4,users li .store{
    height:20px;
    overflow:hidden;
    line-height:20px;
    font-size:12px;
    margin:0;
    padding:0;
    text-overflow:ellipsis;
    white-space: nowrap;

}
.users-list li h4{
    margin-left:10px;
}
.users li .text{
    color:#999;
}
.users li .tip{
    display:none;
    top:50%;
    right:10px;
    transform: translateY(-50%);
    background-color: #ff5454 !important;
}
.users li.noread .tip{
      display:block;
}
.users li.avtive{
    background:#fff3dd
}

.avatar-user{
    padding:10px 5px;
    overflow:hidden;
    border-bottom:1px #dbdbdb solid;
    position:relative;
    padding:5px;
    display: flex;
    align-items: center;
    padding-left: 20px;
}
.avatar-user img{
    float:left;
    width:30px;
    height:30px;
    border-radius:30px
}
.avatar-user .infos{
    float:left;
    height:40px;
    margin-left:5px;
    margin-right:5px;
    overflow: hidden;   
    display: flex;
    align-items: center;
}
.avatar-user h4{
    height:20px;
    overflow:hidden;
    line-height:20px;
    font-size:12px;
    margin:0;
    padding:0;
    text-overflow:ellipsis;
    white-space: nowrap;
}
.avatar-user .text{ color:#fff;	margin-left:10px;}
.message-box .message ul{overflow-y:auto}
.message li{
    width:100%;
    overflow:hidden;
    padding:10px;
}
.message li > img{
    width:30px;
    height:30px;
    border-radius:30px
}
.message li.left .infos,.message li.left > img{float:left}
.message li.right .infos,.message li.right > img{float:right}
.message li .infos{
    background:#fff;
    padding:10px;
    border-radius:5px;
}
.message li.left .infos{
    margin-left:10px;
}
.message li.right .infos{
    margin-right:10px;
}
.message li.times{
    text-align:center;
    padding:5px;
    color:#999;

}
.message li.loadmore{
    text-align:center;
    color:#3399ea;
    cursor:pointer
}
.scrollbar::-webkit-scrollbar {
    width: 5px;
    height: 5px;
}
.scrollbar::-webkit-scrollbar-button{/*滚动条两端的按钮，可以用display:none让其不显示，也可以添加背景图片，颜色改变显示效果（位置2）*/
    background:#74D334;
}
.scrollbar::-webkit-scrollbar-track{/*外层轨道，可以用display:none让其不显示，也可以添加背景图片，颜色改变显示效果（位置3）*/
    background:#FF66D5;
}
.scrollbar::-webkit-scrollbar-track-piece{/*内层轨道，滚动条中间部分（位置4）*/
    background:#FF66D5;
}
.scrollbar::-webkit-scrollbar-thumb{/*滚动条里面可以拖动的那部分（位置5）*/
    background:#FFA711;
    border-radius:4px;
 }
.scrollbar::-webkit-scrollbar-corner {/*边角（位置6）*/
    background:#82AFFF;
}
.scrollbar::-webkit-scrollbar-resizer  {/*定义右下角拖动块的样式（位置7）*/
    background:#FF0BEE;
}
.scrollbar{
    scrollbar-arrow-color: #f4ae21; /**//*三角箭头的颜色*/
    scrollbar-face-color: #333; /**//*立体滚动条的颜色*/
    scrollbar-3dlight-color: #666; /**//*立体滚动条亮边的颜色*/
    scrollbar-highlight-color: #666; /**//*滚动条空白部分的颜色*/
    scrollbar-shadow-color: #999; /**//*立体滚动条阴影的颜色*/
    scrollbar-darkshadow-color: #666; /**//*立体滚动条强阴影的颜色*/
    scrollbar-track-color: #666; /**//*立体滚动条背景颜色*/
    scrollbar-base-color:#f8f8f8; /**//*滚动条的基本颜色*/
}
.services{
    padding:5px;
}
.services li{
    overflow:hidden;
    height:40px;
    padding:5px;
    border-bottom:1px #dbdbdb dotted;
}
.services img{
    width:30px;
    height:30px;
    border-radius:30px;
    margin-right:5px;
    float:left;
}
.services .name{
    float:left;
    font-size:14px;
    margin-top: 4px;
}
.services .links{
    float:right;
    width:40px;
    height:20px;
    line-height:20px;
    overflow:hidden;
    font-size:12px;
    border-radius:5px;
    border:1px #dbdbdb solid;
    cursor:pointer;
    text-align:center;
}
.tabs-title{
    padding:5px;
}
.nav li{
   font-size:12px;
   border-top:0
}
.nav li a{
   border-top:0 !important
}
.services  .loginout{
    background:#f5f5f5
}
.goods{
    max-width:400px;
    overflow:hidden;
}
.goods .goods-img{
    width:80px;
    height:80px;
    float:left;
    margin-right:10px;
}
.goods .goods-info{
    min-height:80px;
   
    margin-left:10px;
}
.goods .goods-info h6{
    height:16px;
    font-size:14px;
    line-height:16px;
    overflow:hidden;
    word-break:break-all;
    word-wrap:break-word;
    text-overflow:ellipsis;
    margin:0 !important;
}
.goods .goods-info .price{
    height:30px;
    line-height:30px;
    font-size:16px;
    overflow:hidden;
    color:red
}
.goods .goods-info .info{
    height:20px;
    line-height:20px;
    font-size:11px;
    overflow:hidden;
    color:#666
}
.goods .goods-info .remark{
    color:#999;
    font-size:11px;
}
.goods .goods-info .btn{
    margin-left:10px;
}
img.face{
    width:24px;
    height:24px;
    vertical-align:text-bottom
}
#face_list{
    padding:10px;
    width:400px;
    bottom:30px;
    left:0px;
}
#face_list img{
    padding:5px;
    cursor:pointer;
}
.message li .infos.picture{
    background:#f5f5f5
}
.message li .infos.picture img{max-width:200px}
.message li .infos.tomoney{
    padding:0 !important;
    border-radius:5px;
    overflow:hidden;
    min-width:200px;
}
.message li .infos.tomoney .tomoney-info{
    overflow:hidden;
    background:#f0ad4e;
    padding:10px;
    color:#fff
}
.message li .infos.tomoney .tomoney-info .icon{
    float:left;
    height:42px;
    width:42px;
    margin-top:4px;
    margin-right:8px;
    background:url(../images/tomoney.png);
    background-size:100% 100%;
}
.message li .infos.tomoney .tomoney-info .info{
    overflow:hidden;
    float:left
}
.message li .infos.tomoney .tomoney-info .info h6{margin:0;line-height:28px;font-size:14px;font-weight:bold;height:28px;}

.message li .infos.tomoney .tomoney-info .info .remark{
    font-size:11px;
    height:20px;
    line-height:20px;
    overflow:hidden
}
.message li .infos.tomoney .bottom{
    background:#fff;
    color:#999;
    font-size:9px;
    padding:5px;
}
.send-goods .goods{
    overflow:hidden
}
.send-goods .goods img{width:50px;height:50px;float:left}

.replay{
    padding:10px;
}
.replay li .info{border:1px #dbdbdb dotted;padding:5px;width:100%;height:auto;font-size:12px}
.replay li .btns{margin:10px 0}
.replay-input{padding:10px;}
.replay-input a{margin-top:10px;float:right}
.replay-input textarea{border:1px #dbdbdb dotted}

.comment .comment-score{
       font-size:14px;
       font-weight:bold;
       color:red
}
.autio{
  
}
.autio-play{
    height:24px;
    overflow:hidden;
    line-height:24px; 
    position:relative;
    cursor:pointer
}
.autio-play i{   
    width:24px;
    height:24px;
    float:left   
}

.autio-play i.play{
    background:url(../images/audio-play.png) no-repeat left;
    background-size:100% 100%;
}
.autio-play i.pause{
    background:url(../images/audio-pause.png) no-repeat left;
    background-size:100% 100%;
}
.autio-play span{
   float:left;
   margin-left:10px;
}
.alt_img{
    position: fixed;
    overflow:hidden;
    display:none;
    border-radius:10px;
    box-shadow:2px 2px 5px #9d9d9d;
}
.alt_img_title{
    width: 100%;
    height: 30px;
    background-color: #3399ea;
    text-align: right;
}
.alt_img_title > img{
    width: 30px;
    height: 30px;
    cursor:pointer
}
.bit_img{
    background-color: #f6f6f6;
    width: 100%;
    height:100%;
    overflow-y:auto;    
}
.bit_img img{
    width: 100%;
}
.store-user{	
	padding-left:30px;
}
.store-user img{
	border-radius:0
}
.store-user span{
	padding-left:5px;
	color:666
}
.right-btn a{
	display:inline-block;
	position:relative;
	overflow:hidden;
}
.right-btn a input[type=file]{
	position: absolute;
    font-size: 100px;
    right: 0;
    top: 0;
    opacity: 0;
    filter: alpha(opacity=0);
    cursor: pointer
	
}
.message li .infos .loading{
	width:20px;
	height:20px;
	background:url(../images/loading.gif) no-repeat;
	background-size:100% 100%;	
}
.message li .infos .loading-error{	
	color:Red;
	font-size:11px;
}
.message li .infos.video{
    background:#f5f5f5
}
.message li .infos.video video{max-width:200px}
.message li .infos .remark{
	color:#999;
	font-size:11px;
}
.message li .infos.video video::-webkit-media-controls-fullscreen-button{ display: none !important; } 
.message li .infos.video video::-webkit-media-controls-mute-button { display: none !important;}
.message li .infos.video video::-internal-media-controls-overflow-button{ display: none !important;}
.order {
    padding:10px;   
    max-width:400px;
}
.order .icon,.order .remark{
    color:#ddd;    
    font-size:12px
}
.order .icon i{
    margin-right:5px;
}
.order .order-goods{
    width:100%;
    border:none;
    margin-top:5px;
}
.order .order-goods img{
    width:40px;
    height:40px;
}
.order .order-goods td{
   border-top:5px #fff solid; 
}
.order .order-goods{
    font-size:12px;
    line-height:14px;   
}
.order .order-goods .thumb{  
    width:50px;

}
.order .order-goods .sku{  
    color:#999;
    margin-top:5px
}
.order .order-goods .num{  
    color:#999;
    width:40px;
    text-align:center
}
.order .order-goods .price{  
    color:red;
    width:40px;
    text-align:right
}
.order .address{
    font-size:12px;
    line-height:18px;
    color:#444;   
    margin-top:10px;
}
.mt10{margin-top:10px}